<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head>
	<title>Add Student</title>
</h:head>
<f:view>
	<h:body>
		<ui:composition template="../includes/template.xhtml">
			<ui:define name="mainbody">
				<center>
					<h:form>
						<p:panel header="Add Student" style="min-height: 550px"
							styleClass="prime_panel">
							<p:growl id="growl" showDetail="true" sticky="false"
								autoUpdate="true" showSummary="false" />
							<center>

								<table border="0" cellpadding="4px" cellspacing="8px">

									<tr>
										<td><h:outputText value="Student Name :" />
											<h:outputText value="*" style="color:red" /></td>
										<td><p:inputText id="studentName"
												value="#{studentBean.student.name}" size="20"
												required="true" requiredMessage="Please enter Student Name" >
												<f:ajax execute="@this" event="blur" />
												</p:inputText>
										</td>

										<td><h:outputText value="Class :" />
											<h:outputText value="*" style="color:red" /></td>
										<td><p:selectOneMenu
												value="#{studentBean.student.section}" effect="fade"
												converter="sectionConverter" style="width:160">
												<f:selectItems value="#{studentBean.sections}" var="s"
													itemLabel="#{s.clas.classTitle} - #{s.sectionTitle}"
													itemValue="#{s}" required="true"
													requiredMessage="Please select a Class" />
											</p:selectOneMenu>
										</td>
									</tr>

									<tr>
										<td><h:outputText value="DOB :" />
											<h:outputText value="*" style="color:red" /></td>
										<td><p:calendar style="width: 150" size="20" mode="popup"
												navigator="true" pattern="dd-MM-yyyy" effect="fadeIn"
												showButtonPanel="true" value="#{studentBean.student.dob}"
												readOnlyInputText="true" required="true"
												requiredMessage="Please enter Student's Date of Birth" >
												<f:ajax execute="@this" event="blur" />
												</p:calendar></td>
										<td><h:outputText value="Present Address :" /></td>
										<td><p:inputText id="stdPresAddress"
												value="#{studentBean.student.presentAddress}" size="20" />
										</td>
									</tr>



									<tr></tr>
									<tr>
										<td colspan="2">
										<B>
											<h:outputText value="Parent Information :" style="font-size:18" />
										</B>
										</td>
									</tr>
									<tr>
										<td><h:outputText value="Father Name :" />
											<h:outputText value="*" style="color:red" /></td>
										<td><p:inputText id="fatherName"
												value="#{studentBean.student.parent.name}" size="20"
												required="true" requiredMessage="Please enter Father Name" >
												<f:ajax execute="@this" event="blur" />
												</p:inputText>
										</td>
										<td><h:outputText value="SSN/NIC #: " />
											<h:outputText value="*" style="color:red" /></td>
										<td><p:inputText id="nic"
												value="#{studentBean.student.parent.CNIC}" size="20"
												required="true"
												requiredMessage="Please enter Father SSN/NIC Number" >
												<f:ajax execute="@this" event="blur" />
												</p:inputText>
										</td>
									</tr>

									<tr>

										<td><h:outputText value="Ph. Number :" />
											<h:outputText value="*" style="color:red" /></td>
										<td><p:inputMask id="parent-ph" mask="+99-9999999999"
												value="#{studentBean.student.parent.phoneNumber}" size="20"
												required="true" requiredMessage="Please enter Phone Number" >
												<f:ajax execute="@this" event="blur" />
												</p:inputMask>
										</td>
										<td><h:outputText value="Cell Number :" />
											<h:outputText value="*" style="color:red" /></td>
										<td><p:inputMask id="parent-mob" mask="+99-9999999999"
												value="#{studentBean.student.parent.mobileNumber}" size="20"
												required="true" requiredMessage="Please enter Mobile Number" >
												</p:inputMask>
										</td>
									</tr>

									<tr>
										<td><h:outputText value="Email :" />
											<h:outputText value="*" style="color:red" />
										</td>
										<td><p:inputText id="email"
												value="#{studentBean.student.parent.user.email}" size="20"
												required="true" requiredMessage="Please enter Email Address"
												validatorMessage="Please enter valid Email Address" >
												 <f:validateRegex
													for="email"
												pattern="^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$"></f:validateRegex>
												<f:ajax execute="@this" event="blur" />
												</p:inputText>
										</td>
										<td><h:outputText value="Password :" />
											<h:outputText value="*" style="color:red" />
										</td>
										<td><p:password size="20"
												value="#{studentBean.student.parent.user.password}"
												feedback="true" match="password1" required="true"
												requiredMessage="Please enter the password"
												validatorMessage="Both Passwords should to be match"
												id="password" >
												<f:ajax execute="@this" event="blur" />
												</p:password>
										</td>

									</tr>
									<tr>
									
										<td><h:outputText value="Present Address:" />
											<h:outputText value="*" style="color:red" />
										</td>
										<td><p:inputText id="presAddress"
												value="#{studentBean.student.parent.presentAddress}"
												size="20"  required="true" requiredMessage="Please enter Present Address">
												<f:ajax execute="@this" event="blur" />
												</p:inputText>
										</td>
										
										<td><h:outputText value="Re-Enter Password :" />
										</td>
										<td><p:password feedback="false" id="password1" size="20"/>
										</td>			

									</tr>
									<tr>
										<td></td>
										<td></td>
										<td><h:outputText value="Permanent Address:" />
										</td>
										<td><p:inputText id="permAddress"
												value="#{studentBean.student.parent.permanentAddress}"
												size="20" />
										</td>

									</tr>

									<tr>
										<td></td>
										<td></td>
										<td></td>
										<td style="text-align: right"><p:commandButton
												id="submit" ajax="false" value="Add Student" type="submit"
												action="#{studentBean.perform}" />
										</td>
									</tr>
								</table>
							</center>
						</p:panel>
					</h:form>
				</center>
			</ui:define>
		</ui:composition>
	</h:body>
</f:view>
</html>
